@extends('layouts.frontend-iframe-base')


@section('css')
@stop

@section('content')
        <!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        警报中心
        <small>警报数据</small>
    </h1>
</section>

<!-- Main content -->
<section class="content">

    <!-- Your Page Content Here -->
    <div class="row">
        <div class="col-md-12">
            <div class="box">
                <div class="box-header">
                    <h3 class="box-title">最新报警数据</h3>

                </div>
                <!-- /.box-header -->

                <div class="box-body table-responsive no-padding">
                    <div style="margin-left: 10px; margin-top: 20px; margin-bottom: 10px;">
                        <a href="javascript:;" id="J-read-all" class="btn btn-sm btn-info">全部设为阅读</a>
                        <a href="javascript:;" id="J-read-selected" class="btn btn-sm btn-info">选择部分设为阅读</a>
                        <a href="javascript:;" id="J-del-all" class="btn btn-sm btn-danger">全部删除</a>
                        <a href="javascript:;" id="J-del-selected" class="btn btn-sm btn-danger">删除选中部分</a>
                    </div>
                    <table class="table table-hover" id="J-table">
                        <tbody>
                        <tr>
                            <th><input id="operAll" onclick="getAll()" type="checkbox"/></th>
                            <th></th>
                            <th></th>
                            <th>当前状态</th>
                            <th>站点名称</th>
                            <th>设备名称</th>
                            <th>报警时间</th>
                        </tr>
                        @foreach($list as $d)
                        <tr>
                            <th><input class="inputs" type="checkbox" data-id="{{$d['id'] or ''}}"/></th>
                            <td><i class="fa fa-warning text-red"></i></td>
                            <td>

                                @if($d['read']==1)
                                    <i class="fa fa-folder-open text-muted"></i>
                                @else
                                    <i class="fa fa-folder text-yellow"></i>
                                @endif
                            </td>
                            <td>{{$d['status_label']}}</td>
                            <td>{{$d['site_name']}}</td>
                            <td>{{$d['device_name']}}</td>
                            <td>{{$d['EventTime']}}</td>


                        </tr>
                        @endforeach

                        </tbody>
                    </table>
                </div>
                <!-- /.box-body -->
            </div>
        </div>
    </div>

</section>
<!-- /.content -->


<div class="modal" id="J-del-all-modal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">安全确认</h4>
            </div>
            <div class="modal-body">
                <p>删除警报信息需要提供用户密码</p>
                <input type="password" class="form-control" placeholder="请输入用户密码">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="J-del-all-submit">确定</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<div class="modal" id="J-del-selected-modal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">安全确认</h4>
            </div>
            <div class="modal-body">
                <p>删除警报信息需要提供用户密码</p>
                <input type="password" class="form-control" placeholder="请输入用户密码">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="J-del-selected-submit">确定</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->


@stop

@section('js')
    <script>
        $(function(){

            $('#J-del-all').click(function(){
                $('#J-del-all-modal').modal('show');
            });

            $('#J-del-all-submit').click(function(){
                var params={};
                params.password=$('#J-del-all-modal input').val();
                $.post('/frontend/warn/del-all-temp',params,function(res){
                    if(res.status==1){
                        alert('删除成功！');
                        window.location.href = '/frontend/warn/last-temp';
                    }else{
                        alert(res.error_msg);
                    }
                },'json');

            });

            $('#J-del-selected').click(function(){
                var size=$('#J-table input[type="checkbox"]:checked').size();
                if(size==0){
                    alert('请先选中报警记录！');
                    return;
                }
                $('#J-del-selected-modal').modal('show');
            });

            $('#J-del-selected-submit').click(function(){
                var params={};
                params.password=$('#J-del-selected-modal input').val();
                var ids=[];
                $('#J-table input[type="checkbox"]:checked').each(function(){
                    ids.push($(this).data('id'));
                });
                params.ids=ids.join(',');
                console.log(params);
                $.post('/frontend/warn/del-selected-temp',params,function(res){
                    if(res.status==1){
                        alert('删除成功！');
                        window.location.href = '/frontend/warn/last-temp';
                    }else{
                        alert(res.error_msg);
                    }
                },'json');
            });

            $('#J-read-all').click(function(){
                $.post('/frontend/warn/read-all-temp',{},function(res){
                    if(res.status==1){
                        alert('设置成功！');
                        window.location.href = '/frontend/warn/last-temp';
                    }else{
                        alert(res.error_msg);
                    }
                },'json') ;
            });

            $('#J-read-selected').click(function(){
                var size=$('#J-table input[type="checkbox"]:checked').size();
                if(size==0){
                    alert('请先选中报警记录！');
                    return;
                }
                var ids=[];
                $('#J-table input[type="checkbox"]:checked').each(function(){
                    ids.push($(this).data('id'));
                });
                var params={};
                params.ids=ids.join(',');

                $.post('/frontend/warn/read-selected-temp',params,function(res){
                    if(res.status==1){
                        alert('设置成功！');
                        window.location.href = '/frontend/warn/last-temp';
                    }else{
                        alert(res.error_msg);
                    }
                },'json') ;
            });

        });

    </script>
    <script>

        function getAll()
        {
            var tit = document.getElementById("operAll");
            var inputs = document.getElementsByClassName("inputs");
            for(var i = 0; i < inputs.length; i++)
            {
                if(inputs[i].type == "checkbox")
                {
                    if(tit.checked == true)
                    {
                        inputs[i].checked = true;
                    }else{
                        inputs[i].checked = false;
                    }
                }
            }
        }

    </script>

@stop